<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style type="text/css">
    body {
      background-color: rgb(242,242,242);
    }
    * {
      margin: 0 auto;
    }
  </style>
  <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

  <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
  <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

  <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
  <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div style="width: 1600px;height: 1200px;background-color: rgb(242,242,242)">
  <a  style="margin-bottom: 3px" th:each="scenery:${pageInfo.list}" th:href="'/view/showDetails?location='+${scenery.location}+'&describe='+${scenery.describes}+'&createTime='+${scenery.createTime}+'&name='+${scenery.myname}+'&mytype='+${scenery.mytype}+'&id='+${scenery.id}">
    <img th:src="@{${scenery.location}}" width="394" height="298px" style="margin-bottom: 5px;margin-right: 5px" th:title="${scenery.describes}">
  </a>
</div>
<div class="modal-footer no-margin-top">
  <div class="col-md-6 col-xs-8 col-xs-offset-1">
    当前第 [[${pageInfo.pageNum}]]页，共 [[${pageInfo.pages}]] 页， 共 [[${pageInfo.total}]] 条记录
  </div>

  <ul class="pagination pull-left no-margin">
    <li>
      <a th:href="'/scenery/searchByName?pageNum=1&myname='+${myname}">首页</a>
    </li>
    <li class="prev" th:if="${pageInfo.hasPreviousPage}">
      <a th:href="'/scenery/searchByName?pageNum='+${pageInfo.prePage}+'&myname='+${myname}">
        <i class="ace-icon fa fa-angle-double-left"></i>
      </a>
    </li>
    <!--遍历条数-->
    <li th:each="nav:${pageInfo.navigatepageNums}">
      <a th:href="'/scenery/searchByName?pageNum='+${nav}+'&myname='+${myname}" th:text="${nav}" th:if="${nav != pageInfo.pageNum}"></a>
      <span style="font-weight: bold;background: #6faed9;" th:if="${nav == pageInfo.pageNum}" th:text="${nav}" ></span>
    </li>

    <li class="next" th:if="${pageInfo.hasNextPage}">
      <a th:href="'/scenery/searchByName?pageNum='+${pageInfo.nextPage}+'&myname='+${myname}">
        <i class="ace-icon fa fa-angle-double-right"></i>
      </a>
    </li>
    <li>
      <a th:href="'/scenery/searchByName?pageNum='+${pageInfo.pages}+'&myname='+${myname}">尾页</a>
    </li>
  </ul>
</div>
</body>
</html>